<%--
  Created by IntelliJ IDEA.
  User: xiaoding
  Date: 2021/1/16
  Time: 19:41
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" isELIgnored="false" %>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>注册</title>
    <link rel="stylesheet" type="text/css" href="bootstrap-3.3.7-dist/css/bootstrap.css">
    <link rel="stylesheet" type="text/css" href="bootstrap-3.3.7-dist/css/Style.css">
    <link rel="stylesheet" type="text/css" href="bootstrap-3.3.7-dist/css/reg.css">
    <script src="bootstrap-3.3.7-dist/js/JQuery.js" type="text/javascript" charset="utf-8"></script>
    <script src="bootstrap-3.3.7-dist/js/bootstrap.js" type="text/javascript" charset="utf-8"></script>
    <script>
        $(function () {
            //设置点击事件
            $(".zhuCe").click(function () {

                //获取参数
                var phone = $("#phone").val().trim();
                var pws = $("#pws").val().trim();
                var name = $("#name").val().trim();
                var age = $("#age").val().trim();
                var sex = $(".sex").val().trim();
                var email = $("#email").val().trim();

                //正则验证
                var phones = /^1[3|4|5|8|7|6][0-9]\d{4,8}$/;
                var pwss = /([a-zA-Z0-9!@#$%^&*()_?<>{}]){6,18}/;
                var names = /[\u4e00-\u9fa5_a-zA-Z0-9_]{2,30}/;
                var ages = /^(?:[1-9][0-9]?|1[01][0-9]|120)$/;
                var emails = /^[a-z0-9]+([._\\-]*[a-z0-9])*@([a-z0-9]+[-a-z0-9]*[a-z0-9]+.){1,63}[a-z0-9]+$/;

                //判断内容是否为空
                if (phone == "" || phone == "null") {
                    alert("请输入账号");
                }else if (!phones.test(phone)) {
                    alert("您输入的账号，不符合规范，请输入手机号");
                }else if (pws == "" || pws == "null") {
                    alert("请输入密码");
                }else if (!pwss.test(pws)) {
                    alert("密码至少6个字符,最长18个字符,规范:可以用数字、英文大小写、包含特殊字符!@#$%^&*()_?<>{}");
                }else if (name == "" || name == "null") {
                    alert("请输入昵称");
                }else if (!names.test(name)) {
                    alert("昵称至少2个字符,最长30个字符,规范:最少包含一个汉字,可以用数字、英文大小写、特殊符号!@#$%^&*()_?<>{}");
                }else if (age == "" || age == "null") {
                    alert("请输入年龄");
                }else if (!ages.test(age)) {
                    alert("年龄不能小于0,不等大于120岁");
                }else if (email == "" || email == "null") {
                    alert("请输入邮箱");
                }else if (!emails.test(email)) {
                    alert("请输入正确的邮箱格式");
                }else {
                    //定义一个开关,判断是否有重复数据
                    var flag = true;
                    //定义变量存数据
                    var obj = null;
                    //ajax异步获取信息
                    $.ajax({
                        url : "UserServlet?flag=isRepetitive",//后台请求的数据，用的是PHP
                        dataType : "json",//数据格式
                        type : "post",//请求方式
                        async : true,//是否异步请求
                        success : function(data) {   //如果请求成功，返回数据。
                            //循环遍历数据判断是否相同
                            for (var i = 0;i<data.data.length;i++) {
                                if ((email == data.data[i].email) && (phone == data.data[i].account)) {
                                    flag = false;
                                    alert("您已注册，无须在注册了");
                                    break;
                                }else if (email == data.data[i].email) {
                                    flag = false;
                                    alert("此邮箱已被注册")
                                    break;
                                }else if (phone == data.data[i].account) {
                                    flag = false;
                                    alert("此账号已被注册");
                                    break;
                                }
                            }

                            //判断开关是否为true
                            if (flag) {
                                //设置表单路径
                                $("#reg").attr("action","LoginServlet?flag=reg");
                                //提交表单
                                $("#reg").submit();
                            }
                        },
                    })
                }
            });
        })
    </script>
</head>
<body background="images/bg.jpg">
<h1>欢迎注册图书管理系统</h1>
<div class="reg">
    <form method="post" id="reg" action="#">
        <div class="form-group">
            <label for="phone">账号(手机号)</label>
            <input type="text" class="form-control" name="phone" id="phone" placeholder="请输入账号">
        </div>
        <div class="form-group">
            <label for="pws">密码</label>
            <input type="password" class="form-control" name="pws" id="pws" placeholder="请输入密码">
        </div>
        <div class="form-group">
            <label for="name">昵称</label>
            <input type="text" class="form-control" name="name" id="name" placeholder="请输入昵称">
        </div>
        <div class="form-group">
            <label for="age">年龄</label>
            <input type="text" class="form-control" name="age" id="age" placeholder="请输入密码">
        </div>
        <div class="form-group">
            <label for="sex">性别</label>
            <input type="radio" class="sex" name="sex" value="男" id="sex" checked>男
            <input type="radio" class="sex" name="sex" value="女" id="sex1">女
        </div>
        <div class="form-group">
            <label for="email">邮箱</label>
            <input type="email" class="form-control" name="email" id="email" placeholder="请输入邮箱">
        </div>
        <button type="button" class="btn btn-default zhuCe">确定</button>
    </form>
</div>
</body>
</html>
